<template>
  <div class="global-common-list-group-template-container">
    <div class="group-container">
      <slot name="group"></slot>
    </div>
    <div class="list-container">
      <base-list v-if="!customRight">
        <!--  顶部查询框  -->
        <slot name="search" slot="search"></slot>
        <!--  操作按钮组  -->
        <slot name="tools" slot="tools"></slot>
        <!--  内容  -->
        <slot name="content" slot="content"></slot>
        <!--  分页  -->
        <slot name="pagination" slot="pagination"></slot>
        <!--  其他(弹框)  -->
        <slot slot="default"></slot>
      </base-list>
      <slot name="custom_right" v-else></slot>
    </div>
    <slot name="group-default"></slot>
  </div>
</template>

<script>
import BaseList from "./components/BaseList";

export default {
  name: "CommonListGroup",
  components: {
    BaseList,
  },
  props: {
    customRight: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {};
  },
  methods: {},
  mounted() {},
};
</script>

<style scoped lang="scss">
.global-common-list-group-template-container {
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;

  .group-container {
    width: 239px;
    padding: 18px;
    box-sizing: border-box;
    background-color: #fff;
    border-right: 1px solid #eee;
    overflow: hidden;
  }

  .list-container {
    width: calc(100% - 240px);
    background-color: #fff;
  }
}
</style>
